<template>
  <div class="jingdian">
    <a href="/movie/1198179">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p1.meituan.net/movie/6a0b995daf79a1112aab8fb441f655ff3419929.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">阳光姐妹淘</div>
            <div class="english-title line-ellipsis">sunny sisters</div>
            <div class="actors line-ellipsis">喜剧,剧情,青春</div>
            <div class="show-info line-ellipsis">2021-06-11 14:00中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">8.8</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
    <a href="/movie/1298908">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p0.meituan.net/movie/d64ec660e53e2cd84f1efe939c737b703647774.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">完美受害人</div>
            <div class="english-title line-ellipsis">The perfect Victim</div>
            <div class="actors line-ellipsis">悬疑,犯罪,剧情</div>
            <div class="show-info line-ellipsis">2021-06-25中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="no-score">暂无评分</div>
        </div>
      </div>
    </a>
    <a href="/movie/1299372">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p0.meituan.net/movie/48774506dc0e68805bc25d2cd087d1024316392.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">你好，李焕英</div>
            <div class="english-title line-ellipsis">Hi, Mom</div>
            <div class="actors line-ellipsis">喜剧,剧情</div>
            <div class="show-info line-ellipsis">2021-02-12 08:00中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">9.5</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
    <a href="/movie/1298367">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p0.meituan.net/movie/3ad18f011110130e927d50046fde86f71038961.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">悬崖之上</div>
            <div class="english-title line-ellipsis">Cliff Walkers</div>
            <div class="actors line-ellipsis">剧情,悬疑,动作</div>
            <div class="show-info line-ellipsis">2021-04-30 18:00中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">9.1</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
    <a href="/movie/1213261">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p0.meituan.net/movie/32ec8754ef53c9239ebae0af62b8581a393364.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">热带往事</div>
            <div class="english-title line-ellipsis">Are You Lonesome Tonight？</div>
            <div class="actors line-ellipsis">剧情,犯罪,悬疑</div>
            <div class="show-info line-ellipsis">2021-06-12 08:00中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">7.4</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
    <a href="/movie/644174">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p0.meituan.net/moviemachine/8d4fd5413b933fdd34e693b7fff5dca7241741.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">黑白魔女库伊拉</div>
            <div class="english-title line-ellipsis">Cruella</div>
            <div class="actors line-ellipsis">喜剧,犯罪</div>
            <div class="show-info line-ellipsis">2021-06-06中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">9.2</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
    <a href="/movie/1250676">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p0.meituan.net/movie/94bfc893acb9c586f6270eb8ef5096d53124190.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">了不起的老爸</div>
            <div class="english-title line-ellipsis">On Your Mark</div>
            <div class="actors line-ellipsis">剧情,喜剧,运动</div>
            <div class="show-info line-ellipsis">2021-06-18 08:00中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">9.2</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
    <a href="/movie/343568">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p0.meituan.net/moviemachine/58732574fbc2f64c04c3e825c058da7f16742753.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">哥斯拉大战金刚</div>
            <div class="english-title line-ellipsis">Godzilla vs Kong</div>
            <div class="actors line-ellipsis">动作,冒险,科幻</div>
            <div class="show-info line-ellipsis">2021-03-26 08:00中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">8.9</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
    <a href="/movie/1302134">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p0.meituan.net/movie/69291d617c3dc5dcac5e3bf29dda63ac2200192.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">哆啦A梦：伴我同行2</div>
            <div class="english-title line-ellipsis">STAND BY ME ドラえもん2</div>
            <div class="actors line-ellipsis">剧情,动画</div>
            <div class="show-info line-ellipsis">2021-05-28 08:00中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">9.0</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
    <a href="/movie/1207687">
      <div class="classic-movie">
        <div class="avatar">
          <img src="https://p1.meituan.net/movie/c285c0124ced6f14d93876c53f9f64361034708.jpg@1l_1e_1c_128w_180h" onerror="this.style.visibility='hidden'">		
        </div>
        <div class="movie-info">
          <div class="title line-ellipsis">普罗米亚</div>
            <div class="english-title line-ellipsis">PROMARE</div>
            <div class="actors line-ellipsis">动作,科幻,动画</div>
            <div class="show-info line-ellipsis">2021-06-05中国大陆上映</div>
        </div>
        <div class="movie-score">
            <div class="score line-ellipsis">
              <span class="grade">9.4</span>
              <span>分</span>
            </div>
        </div>
      </div>
    </a>
</div>
</template>

<script>
export default {
  name: "classic",
};
</script>

<style>
.jingdian{
  padding-top: 15px;
}
.classic-movie {
    position: relative;
    margin: 0 0 20px 20px;
    display: flex;
    -webkit-box-align: start;
    align-items: flex-start;
}
.classic-movie .avatar {
    display: inline-block;
}
.classic-movie .avatar img {
    width: 66px;
    height: 94px;
}
.classic-movie .movie-info {
    margin-left: 10px;
    display: inline-block;
    font-size: 13px;
    line-height: 18px;
    color: #666;
    height: 100%;
    -webkit-box-flex: 1;
    flex: 1;
    overflow: hidden;
}
.classic-movie .movie-info .title {
    font-size: 17px;
    line-height: 24px;
    color: #333;
    font-weight: 700;
}
.classic-movie .movie-info>div {
    margin-bottom: 4px;
}
.line-ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.classic-movie .movie-score {
    width: 60px;
    height: 17px;
    font-size: 12px;
    color: #999;
    line-height: 17px;
    display: inline-block;
    text-align: center;
}
.classic-movie .movie-score .grade {
    color: #faaf00;
    font-size: 15px;
}
</style>
